<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <meta http-equiv="X-UA-Compatible" content="IE=edge">
    <meta name="viewport" content="width=device-width, initial-scale=1.0">
    <title>upload</title>
    <link rel="stylesheet" href="/static/lib/css/layui.css" media="all">
</head>
<body>
    <blockquote class="layui-elem-quote layui-text">
        注意: 请上传自己脸部的清晰照片以供识别 大小不超过20MB
    </blockquote>
    
    <div class="layui-col-md6">
        <button type="button" class="layui-btn" id="test1">
            <i class="layui-icon">&#xe67c;</i>上传图片
        </button>
        <div class="layui-panel">
            <div style="padding: 20px 50px;">
                <img src="/static/profiles/{{student.num}}.png" alt="您还没有上传图片" style="width: 400px;">
            </div>
        </div>
    </div>
</body>
<script src="/static/lib/layui.js"></script>
<script>
    layui.use('upload', function () {
        var upload = layui.upload
          , layer = layui.layer;

        //执行实例
        var uploadInst = upload.render({
            elem: '#test1' //绑定元素
            , url: '../api/upload' //上传接口
            , accept: 'images'
            , size: '20000'
            , done: function (res) {
                console.log("upload done")
                layer.msg("上传成功")
                //上传完毕回调
            }
            , error: function () {
                console.log("upload failed")
                layer.msg("上传失败")
                //请求异常回调
            }
        });
    });
</script>
</html>